/**
 * Copyright 2025 Beijing Volcano Engine Technology Co., Ltd. All Rights Reserved.
 * SPDX-license-identifier: BSD-3-Clause
 */
import tips from '@/assets/AiImgs/tips.png'
import notice from '@/assets/AiImgs/notice.png'
// toast1.png+tips 10s toast2.png+notice 30s  

interface IProps {
  duration?: any;
}
export default function TimeToast(props:IProps) {
  const { duration }=props
  return (
      <div className="absolute z-10 top-0 left-[50%] ml-[-71.5px] mt-1">
        <div className={`w-[143px] h-[36px] flex items-center px-3.5 ${ duration>10?"bg-[url('@/assets/AiImgs/toast2.png')]":"bg-[url('@/assets/AiImgs/toast1.png')]"} bg-cover bg-no-repeat bg-center`} >
            <img className={`${duration>10?'w-[16px] h-[16px]':'w-[13.33px] h-[13.33px]'}`} src={duration>10?notice:tips}/>
            <div className="text-xs ml-1 text-[#222222]">{duration>10?<span>本次通话还剩<span className="text-[#DB0007]">30s</span></span>:<span>通话即将结束<span className="text-[#DB0007]">{duration}s</span></span>}</div>
            {/* 本次通话还剩30s */}
            {/* 通话即将结束10s */}
        </div>
      </div>
  );
}
